﻿<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true" CodeBehind="VentaPaquetes.aspx.cs" Inherits="ABC_SA_WEB.VentaPaquetes" %>

<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div class="form">
        <div>
            <p>Cliente:<asp:Label ID="lblNombreCliente" runat="server" Text="."></asp:Label></p>
            <p>Usuario<asp:Label ID="lblUsuario" runat="server" Text="."></asp:Label></p>
        </div>

        <div class="gridStyle">
            <asp:GridView ID="dgvVenta" runat="server" Height="70px" Width="400px"
                CellPadding="4" GridLines="None" ForeColor="#333333" OnRowDataBound="gv_RowDataBound">


                <AlternatingRowStyle BackColor="White" />
                <Columns>
                    <asp:BoundField DataField="idSG" HeaderText="id" Visible="false" />
                    <asp:BoundField DataField="nombreSG" HeaderText="Nombre" />
                    <asp:BoundField DataField="fechaInicioSG" HeaderText="Fecha Inicio" />
                    <asp:BoundField DataField="fechaFinalSG" HeaderText="Fecha Final" />
                    <asp:BoundField DataField="precioSG" HeaderText="Precio" />
                    <asp:CommandField ButtonType="Image"
                        SelectImageUrl="~/Images/shop-cart-icon.png" SelectText="Comprar"
                        ShowSelectButton="True" />
                </Columns>
                <EditRowStyle BackColor="#2461BF" />
                <FooterStyle BackColor="#507CD1" ForeColor="White" Font-Bold="True" />
                <HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
                <PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
                <RowStyle BackColor="#EFF3FB" />
                <SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
                <SortedAscendingCellStyle BackColor="#F5F7FB" />
                <SortedAscendingHeaderStyle BackColor="#6D95E1" />
                <SortedDescendingCellStyle BackColor="#E9EBEF" />
                <SortedDescendingHeaderStyle BackColor="#4870BE" />
            </asp:GridView>
        </div>


        <div id="modal_dialog" style="display: none;">
            <p>¿Cuántos paquetes desea comprar? </p>

            <p>
                <asp:Label ID="Label1" runat="server" Text="Seleccione la cantidad:"></asp:Label>
                <asp:DropDownList ID="cantidadCompra" runat="server" onchange="calcPrice()">
                    <asp:ListItem>1</asp:ListItem>
                    <asp:ListItem>2</asp:ListItem>
                    <asp:ListItem>3</asp:ListItem>
                    <asp:ListItem>4</asp:ListItem>
                    <asp:ListItem>5</asp:ListItem>
                    <asp:ListItem>6</asp:ListItem>
                    <asp:ListItem>7</asp:ListItem>
                    <asp:ListItem>8</asp:ListItem>
                    <asp:ListItem>9</asp:ListItem>
                    <asp:ListItem>10</asp:ListItem>
                </asp:DropDownList>
            </p>
            <p>
                <label style="display: none;" id="lblIdPaquete"></label>
            </p>
            <p>
                Paquete:
    <label id="detalle"></label>
            </p>
            <p>
                Precio: $
    <label id="lblPrecioTotal"></label>
            </p>
            <label id="precioUnitario" style="display: none;"></label>

            <asp:Label ID="lblASPPrecioTotal" Visible="false" runat="server" Text="Label"></asp:Label>

            <input type="button" id="Button3" value="Comprar" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" runat="server" onserverclick="btnComprar_Click" />
        </div>
        <asp:HiddenField ID="hiddenIdPaquete" runat="server" />
        <asp:HiddenField ID="hiddenPrecio" runat="server" />
        <asp:HiddenField ID="hiddenCantidad" runat="server" />
        <asp:HiddenField ID="hiddenPrecioUnidad" runat="server" />
        <script type="text/javascript">

            /*********************************************************************************************/
            function showDialog(paquete, idPaquete, precio) {
                console.log(paquete);
                $("#modal_dialog").dialog({
                    title: "Detalle de la compra",
                    buttons: {
                    },
                    modal: true,
                    resizable: false

                });

                $("#lblIdPaquete").html(idPaquete);
                $("#detalle").html(paquete);
                $("#lblPrecioTotal").html(precio);
                $("#precioUnitario").html(precio);
                return false;


                /******************************************************************************************hiddenPrecio***/
            }

            function calcPrice() {
                var cantidad = document.getElementById('<%=cantidadCompra.ClientID%>').value;
        var precio = $("#precioUnitario").text();
        var total = Number(cantidad) * Number(precio);
        $("#lblPrecioTotal").html(total);
        //alert(cantidad);hiddenPrecioUnidad
        document.getElementById('<%=hiddenPrecio.ClientID%>').value = total;//cambio
        document.getElementById('<%=hiddenCantidad.ClientID%>').value = cantidad;//cambio
        document.getElementById('<%=hiddenIdPaquete.ClientID%>').value = $("#lblIdPaquete").text();
        document.getElementById('<%=hiddenPrecioUnidad.ClientID%>').value = precio;
        $("#lblPrecioTotal").html(total);


        return false;

    }
    /*********************************************************************************************/

    $("[id*=btnModalPopup]").live("click", function () {
        $("#modal_dialog").dialog({
            title: "Detalle de la compra",
            buttons: {

            },
            modal: true,
            resizable: false
        });
        return false;
    });
        </script>

        <div>
            <asp:Button CssClass="btn" ID="btnVolver" runat="server" OnClick="btnVolver_Click" Text="Volver" />
        </div>
    </div>

</asp:Content>
